// pages/search_after/search_after.ts
Page({
  data: {
    navHeight: 0,
    menuButtonInfo: {
      bottom: 0,
      height: 0,
      top: 0,
      left: 0,
      right: 0,
      width: 0,
    },
    searchMarginTop: 0, // 搜索框上边距
    searchWidth: 0, // 搜索框宽度
    searchHeight: 0, // 搜索框高度
    //展示图片数据
    showimg: [{}],
    //有无数据
    show: true,
    //品牌
    brand: [''],
    //选中样式的三个值
    brand_now: '品牌',
    //功能手机
    fun: ['5G手机', '游戏手机', '拍照手机', '续航手机', '折叠手机'],
    fun_now: '功能',
    //是否显示弹框
    price_list: false,
    fun_list: false,
    //价格升降序 当前
    price_flag: 0,
    //模态框打开的表示 打开摁其他地方关闭（点中是关闭还是查看详情）
    open: false,
    //选中样式的id
    Is_brand_index: 0,
    Is_fun_index: 6,
    //双向绑定搜索内容
    search_value: '',
    //页面总长度
    height: 0,

    // 定位图标 使用xy 别用样式否则限制移动 
    x: 320,
    y: 650,
    url: '',
    page: 1,
    //触底标志
    again: false,
    //回到顶部
    enght:false


  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (option: { keyname: string }) {
    wx.showLoading({
      title: '小的正在努力！',
    })
    console.log(option.keyname)
    option.keyname=option.keyname!=='undefined'?option.keyname:''
    this.setData({ search_value: option.keyname })
    var app = getApp();
    this.setData({
      url: app.globalData.url
    })
    //请求数据
    this.article()
    console.log(this.data.search_value)
    this.setData({
      //获取胶囊一块的宽高
      menuButtonInfo: wx.getMenuButtonBoundingClientRect()
    })
    console.log(this.data.menuButtonInfo);
    //当前小程序运行在企业微信环境中,返回设备信息
    wx.getSystemInfo({
      success: (res) => {
        console.log(res)
        const { screenHeight, screenWidth } = res
        this.setData({
          x: screenWidth - 60,
          y: screenHeight - 100,
          height: screenHeight
        })
        const { statusBarHeight } = res
        //结构状态栏的高度，单位px 减去上面的得边距
        console.log(statusBarHeight)
        const margin = this.data.menuButtonInfo.top - statusBarHeight
        console.log(margin)
        this.setData({
          //总上边距
          navHeight: (this.data.menuButtonInfo.height + statusBarHeight + (margin * 2)),
          searchMarginTop: statusBarHeight + margin, // 状态栏 + 胶囊按钮边距
          searchHeight: this.data.menuButtonInfo.height,  // 与胶囊按钮同高
          searchWidth: this.data.menuButtonInfo.right - this.data.menuButtonInfo.width, // 胶囊按钮右边坐标 - 胶囊按钮宽度 = 按钮左边可使用宽度
          //   main:214
        })
      },

    })

    this.setData({ brand: ['华为', '小米', '三星'] });
    //保存选中加样式
    this.setData({ Is_brand_index: this.data.brand.length + 1 })


  },
  //价格升降序
  price_change() {
    this.setData({ price_list: false, fun_list: false })
    console.log(this.data.price_flag)
    this.setData({
      price_flag: this.data.price_flag + 1
    })
    if (this.data.price_flag > 2) {
      this.setData({
        price_flag: 0
      })
    }

    //价格的升降序改变也要查询


  },
  //品牌改变
  brand_change() {
    //模态框开关
    this.setData({ price_list: !this.data.price_list, open: true });
    //关掉另一个的模态（如果开了的话）
    this.setData({ fun_list: false })
  },
  //功能改变
  fun_change() {
    this.setData({ fun_list: !this.data.fun_list, open: true })
    this.setData({ price_list: false })
  },
  //列表点击事件
  brand_list(e: any) {
    //事件传参数 data-属性传 在target中获取
    console.log(e.target)
    console.log(e.target.dataset.value)
    //存起来确认及查询
    this.setData({ brand_now: e.target.dataset.value })
    //绑定类
    this.setData({ Is_brand_index: e.target.dataset.index })
    console.log(e.target.dataset.index)
    if (this.data.Is_brand_index == -1) {
      this.close();
    }




  },
  fun_list(e: any) {
    //事件传参数 data-属性传 在target中获取
    console.log(e.target)
    console.log(e.target.dataset.value)
    //存起来确认及查询
    this.setData({ fun_now: e.target.dataset.value })
    //绑定类
    this.setData({ Is_fun_index: e.target.dataset.index })
    console.log(e.target.dataset.index)
    if (this.data.Is_fun_index == -1) {
      this.close();
    }
  },

  //关闭模态框
  close() {
    this.setData({ price_list: false, fun_list: false, open: false, page: 1 })
    //模态框关闭及用要进行查询
    //请求数据
    this.article();


  },
  go_com(event: any) {
    if (!this.data.open) {
      console.log(event.currentTarget.dataset.id)
      wx.navigateTo({
        url: `/pages/goods/goods?id=${event.currentTarget.dataset.id}`
      })
    } else {
      this.close();
    }


  },
  //返回首页
  back() {
    wx.navigateBack({
      delta: 1
    })
  },
  //去搜索页面
  search() {
    console.log(5252)
    wx.navigateTo({
      url: `/pages/search/search?keyname=${this.data.search_value}`
    })
  },
  Totop() {
    wx.pageScrollTo({
      scrollTop: 0,
      duration: 300
    })
  },
  change(event: any) {
    console.log(event.detail)
  },
  //获取文章
  article() {
    //文章
    let brand: string;
    let type: string;
    brand = this.data.brand_now === '品牌' ? '' : this.data.brand_now;
    type = this.data.fun_now === '功能' ? '' : this.data.fun_now;
    console.log(brand, type)
    const that = this
    wx.request({
      url: `${this.data.url}api/product?name=${that.data.search_value}&pingpai=${brand}&phone_type=${type}&page=${this.data.page}`, //仅为示例，并非真实的接口地址
      success(res: { data: { code: 0, data: { data: { id: number, news_image: string, news_name: string }[] }[] } }) {
        console.log(res);
        const info = res.data.data;
        console.log(info)
        wx.hideLoading()
        if(that.data.page===1){
          console.log(1111)
          that.setData({
            showimg: info
          })
        }else{
          that.setData({
            showimg: that.data.showimg.concat(info)
          })
        }
        if (info) {
          that.setData({
            show: true
          })
        } else {
          that.setData({
            show: false
          })
        }
        if (info.length < 5) {
          that.setData({
            again: true
          })
        }

      }
    })

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {
    this.setData({
      page: this.data.page + 1,
      enght:true
    })
    
    this.article()
    console.log(1111)

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})